<?php echo $this->render('layouts/__header.phtml'); ?>
<?php echo $this->render('layouts/__nav.phtml'); ?>

<h1>Task Score Wizard</h1><br>    
<form action="/wizard/score" method="post" id="scoreForm">
 	<?php echo $this->render('layouts/__info.phtml'); ?>
    <h3>Step1. Choose a team</h3>
    <div style="padding:10px">Team:&nbsp;&nbsp;
    <select id="team" name="team">
    <option value="">- Team -</option>
	<?php foreach($this->teamList as $team):?>	
    <option value="<?php echo $team->abs;?>" <?php if($this->teamId == $team->abs):?>selected<?php endif;?>><?php echo $team->name;?></option>                     
	<?php endforeach;?>    
	</select>
	</div>
    <h3>Step2. Configure the dimensions</h3>
	<div style="padding:10px;">     
    <b>Basic dimension:</b>
    <div id="scoretable" style="margin-bottom:20px;">
    <table id= "sortTable" class="normaltable">
    <tr>
		<td>Name</td>			  
		<td>Type</td>					
        <td>Description</td>
        <td>Actions</td>
    </tr>
    <?php foreach($this->scoreDimensions as $dimensionKey=>$dimension):?>
	<tr>
		<td><?php echo $dimensionKey; ?></td>			  
		<td><?php echo $dimension[0]; ?></td>					
        <td><?php echo $dimension[1]; ?></td>
        <td><?php if($dimension[2]):?><a href="#" onclick="del('<?php echo $dimensionKey;?>')"><img src="/images/b_empty.png" border="0"></a>
                <?php endif; ?>
        </td>
    </tr>
    <?php endforeach;?>
    </table>
    </div>
    <b>Adding more dimension:</b>       
    <input type="hidden" id="act" name="act" value="new">
    <input type="hidden" id="dName" name="dName" value="">
    <div id="addDimen" >        
	<table class="normaltable">
		<tr onMouseOver="this.style.backgroundColor='#F7F9F9';" onMouseOut="this.style.backgroundColor='#FFFFFF'">		
		<td>Dimension Name</td>
		<td><input type="text" name="newFieldName" id="newFieldName" value="<?php echo $this->newFieldName; ?>"></td>
		</tr>
		<tr onMouseOver="this.style.backgroundColor='#F7F9F9';" onMouseOut="this.style.backgroundColor='#FFFFFF'">	
		<td>Description</td>
		<td><textarea name="newFieldDesc" id="newFieldDesc"><?php echo $this->newFieldDesc; ?></textarea></td>
		</tr>
		<tr onMouseOver="this.style.backgroundColor='#F7F9F9';" onMouseOut="this.style.backgroundColor='#FFFFFF'">	
		<td>Type</td>
		<td>tinyint</td>
		</tr>
		<tr>	
		<td colspan="2" style="text-align:right"><input id="add" type="submit" value="add"></td>
		</tr>
	</table>
	</div>
	
	</div>
    <h3>Step3. Persisting the setting</h3>
    <div style="padding:10px;">* You can change the result at section2.<br/>
    <div class="hintbox"> 
    <?php echo $this->sqlDimen; ?>
    </div>
    <br/> 
   		<input type="button" name="saveScoreSet" value="Save" onclick="save()"/>
    </div>  
    </form>  

<script type="text/javascript">	
	function del(dName){
		if(window.confirm("Are you sure to delete field: "+dName)){
			$('action').value = 'del';
			$('dName').value = dName;
			$('scoreForm').submit();
		}
	}
	
	function save(){		
		$('action').value = 'createTable';
		$('scoreForm').submit();
	}
</script>
  
<?php echo $this->render('layouts/__footer.phtml'); ?>